<template>
  <div class="permission_content">
      <div>
          <el-table :data="datlyContList" border style="width: 100%" @row-click="clickTableLine">
              <el-table-column
                prop="uname"
                label="姓名"
                width="180">
              </el-table-column>
              <el-table-column prop="proName" label="项目名称" width="180">
                <template slot-scope="scope">
                    {{scope.row.list[0].proName}}
                </template>
              </el-table-column>
              <el-table-column prop="taskName" label="任务名称" width="180">
                <template slot-scope="scope">
                    {{scope.row.list[0].taskName}}
                </template>
              </el-table-column>
               <el-table-column  prop="workTime" label="工作工时" width="180">
                 <template slot-scope="scope">
                    {{scope.row.list[0].workTime}}
                </template>
              </el-table-column>
               <el-table-column
                prop="content"
                label="日报内容">
              </el-table-column>
          </el-table>

         <div class="pagination">
          <pagination  :total="params.total" :page="params.page" :limit="params.limit" @pagination="handleSizeChange"  />
        </div>  
      </div>

      <el-dialog
        title="日报查看"
        :visible.sync="dailyDetail"
        width="40%"
        class="editdialog">
        
<!-- v-for="item in dailyDetailCont.list" :key="item.id" -->

        <el-row :gutter="30" v-if="dailyDetailCont.list.length > 0">
          <div class="day_boxItem" v-for="item in dailyDetailCont.list" :key="item.id" >
            <el-col :span="8">
                <div class="sub-title">项目名称</div>
                <el-input :readonly="true" v-model="item.proName" placeholder="无"></el-input>
            </el-col> 
            <el-col :span="8">
                <div class="sub-title">任务名称</div>
                <el-input :readonly="true" v-model="item.taskName" placeholder="无"></el-input>
            </el-col>  
            <el-col :span="8">
                <div class="sub-title">工时</div>
                <el-input :readonly="true" v-model="item.workTime" placeholder="无"></el-input>
            </el-col>    
          </div> 
        </el-row>
         <p v-else>加载失败</p>
        <hr style="margin: 30px 0; color: #ccc;" />
     
        <div>
            <p style="margin-left: 10px; font-size: 20px; font-weight: 600;">日报内容</p>
            <el-input type="textarea" :readonly="true" v-model="dailyDetailCont.content"></el-input>
        </div>

        



        <span slot="footer" class="dialog-footer">
          <p style="display: inline-block; color: #ccc;">【仅提供查看】</p>
          <el-button type="primary" @click="dailyDetail = false">关 闭</el-button>
        </span>
      </el-dialog>

  </div>
</template>

<script>
import pagination from '@/components/Pagination/index'

export default {
  name: 'permission',
  components: { pagination},
  data() {
    return {
      dailyDetail: false,
      dailyDetailCont: {
        list:[]
      },
      datlyContList: [
        {
          uname: '张三',
          list: [
            {
              proName: 'OA系统', //项目名称
              taskName: '开发新功能', //任务名
              workTime: '4',
              id: 11
            },
            {
              proName: 'OA系统', //项目名称
              taskName: '测试新功能', //任务名
              workTime: '4',
              id: 12
            },
          ],
          content: '今日完成今日完成今日完成今日完成今日完成今日完成今日完成今日完成今日完成今日完成',
          id: 1
        },
        {
          uname: '李四',
          list: [
            {
              proName: 'AOA系统', //项目名称
              taskName: '山东卡死', //任务名
              workTime: '6',
              id: 21
            },
          ],
          content: '我今天啥都不干不干不干',
          id: 2
        },
        {
          uname: '张三',
          list: [
            {
              proName: 'OAC系统', //项目名称
              taskName: '开发旧功能', //任务名
              workTime: '6',
              id: 31
            },
          ],
          content: '我不gas你就发了发你啦可能付款萨拉',
          id: 3
        },

      ],
      params: {
        page: 1,
        limit: 10,
        total: 100
      },
    }
  },
  mounted() {
   
  },
  methods: {
      handleSizeChange (e) {
        this.params.page = e.page
        this.params.limit = e.limit
      },
      clickTableLine (e) {
        this.dailyDetail = true
        this.dailyDetailCont = {...e}
      },
      searchItem (val) {
          console.log(val, '查询参数')
      }
  }
}
</script>

<style lang="scss" scoped>
  .sub-title{
    font-weight: 800;
    padding: 10px 0;
  }

</style>
